I made custom rule on form elements. But when i use custom error message with promise its giving that error. What should i do for fix it ? My Form elements :
That rule is checking PriceMax and PriceMin. And validate if PriceMax is bigger than PriceMin. If Its not it should show me error message.So i used Promise but it making warning in console like : "Warning: callback is deprecated. Please return a promise instead." Error in custom rules"
<Form.Item name="PriceMin" label="Minimum fiyat" required>
<Input
type="number"
name="Input"
placeholder="En düşük fiyat"
onChange={(e) => updateForm(e.target.value, "PriceMin")}
/>
</Form.Item>
<Form.Item
name="PriceMax"
label="Maximum fiyat"
dependencies={["PriceMin"]}
rules={[
{
required: true,
message: "Please confirm your password!",
},
({ getFieldValue }) => ({
validator(rule, value) {
if (
parseInt(value) < parseInt(getFieldValue("PriceMin"))
) {
return Promise.reject(
"Maksimum fiyat minimum fiyattan az olamaz!" //When i delete that row its fix warning, but i need have that error message.
);
}
},
}),
]}
>
<Input
name="Input"
type="number"
disabled={
MyForm.getFieldValue("PriceMin") === undefined ||
MyForm.getFieldValue("PriceMin") === ""
? true
: false
}
placeholder="En yüksek fiyat"
onChange={(e) => updateForm(e.target.value, "PriceMax")}
/>
</Form.Item>
You must do as shown in the example
https://ant.design/components/form/#components-form-demo-register
The validator should always return a promise on both success and error
({ getFieldValue }) => ({
validator(rule, value) {
if (parseInt(value, 10) < parseInt(getFieldValue("PriceMin"), 10)) {
return Promise.reject(
"Maksimum fiyat minimum fiyattan az olamaz!");
}
return Promise.resolve();
}
})
Also you missed a radix parameter in the parseInt